<template>
    <div id="snowpacklist">
        <div class="nav_hedr">
            <div class="snow_list">
                <span>全部雪场数量</span><span class="text_1">1253</span><span>个,</span><span>上线票务数量</span><span
                    class="text_2">3529423</span><span>个</span>
            </div>
            <div class="query_se">
            <div class="query">
                <span>雪场名称</span>
                <el-input class="snow_name" v-model="inputx"></el-input>
               
               

               
            </div>
            <div class="query_snow_1">
                <span>省份</span>
                <el-select  placeholder="请选择">
                    <el-option v-for="item in 2" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                </el-select>
            </div>
            </div>
             <div class="snow_btn">
     <el-button type="primary">查询</el-button>
 </div>
        </div>
        <div class="snow_footer">
            <div class="block">
                <el-pagination 
                    :current-page.sync="currentPage1" :page-size="100" background layout="total, prev, pager, next"
                    :total="10000">
                </el-pagination>
            </div>
            <el-table :data="tableData" border style="width: 100%">
                <el-table-column prop="date" label="雪场ID号" width="180">
                </el-table-column>
                <el-table-column prop="name" label="雪场名称" width="180">
                </el-table-column>
                <el-table-column prop="address" label="APP ID">
                </el-table-column>
                <el-table-column prop="shoplist" label="商品数量">
                </el-table-column>
                <el-table-column prop="time" label="创建时间">
                </el-table-column>
                <el-table-column prop="address" label="操作">
                    <template slot-scope="scope">
                        <el-button @click="handleClick(scope.row)" type="text" size="small">商品列表</el-button>
                        <el-button type="text" size="small">雪场详情</el-button>
                        <el-button type="text" size="small">评论</el-button>
                    </template>
                </el-table-column>
            </el-table>
            

            
            
            


            
            
        </div>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                tableData: [{
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                }, {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                }, {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                }, {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                },
                {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                }, {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                }, {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                }, {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                }, {
                    date: '117',
                    name: '河北张家口冰雪大世界',
                    address: 'a-766359349',
                    shoplist: "236",
                    time: "2021-08-21 10:52:13"
                },

                ],
                currentPage1: 5,
                currentPage2: 5,
                currentPage3: 5,
                currentPage4: 4,
                inputx:""
            }
        },
        methods: {
          
          
          
          
          
          
        },
    }


</script>
<style scoped>
#snowpacklist{
    width: 100%;
    height: 100%;
    /* background-color: red; */
}
.cell {
    text-align: center;
}
    .block {
       z-index: 1;
        position: absolute;
       overflow: hidden;
       bottom: 0;
       left: 32%;
    }

    .snow_footer {
        width: 100%;
        background-color: #fff;
        position: relative;
        top: 50px;
        border-radius: 10px;
        height: 75%;
      
    }

    .query_snow_1 {
        position: absolute;
    left: 21%;
    top: 54%;
    }


  
    

    .snow_btn {
        position: absolute;
        right: 2%;
        top: 50%;
        

    }

    .nav_hedr {
        width: 100%;
        height: 20%;
        background-color: #fff;
        position: relative;
        top: 20px;
        border-radius: 10px;
    }

    .snow_list {
        width: 98%;
        height: 40px;
        background-color: #EBF4FF;
        position: absolute;
        left: 1%;
        top: 5%;
        border-radius: 5px;
    }

    .snow_list {
        line-height: 40px;
    }

    .text_1 {
        color: #3D85FF;
        font-size: 20px;
    }

    .text_2 {
        color: #3D85FF;
        font-size: 20px;
    }

    .snow_name {
        display: inline-block;
        width: 200px;
        height: 25px;

    }

    .query {
        position: absolute;
    left: 3%;
    top: 54%;
    }

    .el-input__inner {
        height: 35px;
        margin-left: 5px;
    }





</style>